$(function() {
	var $spDiv = $('div.slideImg');
	$spDiv.wrapInner('<div class="imgs" />');
	var $imgs = $('img', $spDiv);
	showImg(0);
	var $btnDiv = $('<div />');
	var $titleUl = $('<ul />');
	$imgs.each(function(i) {
		$btnDiv.append('<span' + (i == 0 ? ' class="hov"' : '') + '>' + (i + 1)
				+ '</span>');
		$titleUl.append('<li' + (i == 0 ? ' style="display: block;"' : '')
				+ '>' + this.alt + '</li>');
		this.alt = '';
	});
	$slideCtrl = $('<div class="slideCtrl" />');
	$slideCtrl.append($btnDiv).append($titleUl).prependTo($spDiv);

	var index = 0;
	$('span', $slideCtrl).mouseover(function() {
		index = $('span', $slideCtrl).index(this);
		showImg(index);
	});

	// 滑入 停止动画，滑出开始动画.
	$spDiv.hover(function() {
		if (iTimerID) {
			clearInterval(iTimerID);
		}
	}, function() {
		iTimerID = setInterval(function() {
			showImg(index)
			index++;
			if (index == 5) {
				index = 0;
			}
		}, 3000);
	});
	// 自动开始
	var iTimerID = setInterval(function() {
		showImg(index)
		index++;
		if (index == $imgs.length) {
			index = 0;
		}
	}, 2000);
})

function showImg(i) {
	var $showImg = $('div.slideImg img').eq(i);
	$showImg.stop(true, true).fadeIn(800).parent()
			.siblings().find('img').hide();
	resizeImg($showImg);
	$('div.slideCtrl li').eq(i).stop(true, true).fadeIn(800).siblings().hide();
	$('div.slideImg span').eq(i).addClass('hov').siblings().removeClass('hov');
}

function resizeImg($img){
	var maxWidth = parseInt($('.slideImg .imgs').css('width')) -2;
	var maxHeight = parseInt($('.slideImg .imgs').css('height')) -2;
	var imgWidth = $img.attr('width'), imgHeight = $img.attr('height');
	$img.attr('width', imgWidth * Math.min(maxWidth/imgWidth, maxHeight/imgHeight));
	$img.attr('height', imgHeight * Math.min(maxWidth/imgWidth, maxHeight/imgHeight));
}